import Doc from '~/components/layout/docs'
import Card from '~/components/card'
import Snippet from '~/components/snippet'
import Link from '~/components/text/link'
import Caption from '~/components/text/caption'
import Note from '~/components/text/note'
import Quickstarts, { Quickstart } from '~/components/quickstarts'
import { UserContext } from '~/lib/user-context'
import { IconCard } from '~/components/card'
import { List } from '~/components/list'
import BitbucketIcon from '~/components/icons/bitbucket'
import GitLabIcon from '~/components/icons/gitlab'
import GitHubIcon from '~/components/icons/github'

import { quickstarts } from '~/lib/data/v2/quickstarts'

export const meta = {
  title: 'Introduction to ZEIT Now',
  description:
    'An introduction to the ZEIT Now platform and how to get started deploying any kind of application.',
  editUrl: 'pages/docs/v2/introduction.mdx',
  lastEdited: '2020-02-04T13:49:03.000Z'
}

ZEIT Now is a cloud platform for **static sites** and **Serverless Functions** that fits perfectly with your workflow. It enables developers to host **JAMstack** websites and web services that **deploy instantly**, **scale automatically**, and requires **no supervision**, all with **no configuration**.

## Deploy an Existing Project

Once you have [signed up to ZEIT](/signup), you can use our [Git integrations](/docs/v2/git-integrations) with [GitHub](/docs/v2/git-integrations/zeit-now-for-github), [GitLab](/docs/v2/git-integrations/zeit-now-for-gitlab), or [Bitbucket](/docs/v2/git-integrations/zeit-now-for-bitbucket) to deploy an existing project – then with a deployment for every push – by selecting a repository from your Git account.

Select a Git provider below to get started deploying your existing repositories and projects:

<List columnsDesktop={3} columnsTablet={3} columnsMobile={1}>
  <IconCard label="GitHub" icon={<GitHubIcon />} href="/new/git?tab=github" plus />
  <IconCard label="GitLab" icon={<GitLabIcon />} href="/new/git?tab=gitlab" plus />
  <IconCard
    label="Bitbucket"
    icon={<BitbucketIcon />}
    href="/new/git?tab=bitbucket"
    plus
  />
</List>

Connect through the ["New Project"](/new) page under the "From an existing project" section, and then from the same place, set up a project using your Git integration.

<Note>
  For more information on setting up Git to deploy with ZEIT and what you can do
  with it, see{' '}
  <Link color href="/docs/v2/git-integration">
    the Git integrations documentation
  </Link>
  .
</Note>

Alternatively, if you want to start fresh with a new project, use a Quickstart template from below. Additionally, you can use this method to start a new Git repository with any connected Git integration.

## Quickstarts

Quickstarts let you get started quickly. The following quickstarts are paired with guides and a deploy button, based on the example found in the [ZEIT Now repository](https://github.com/zeit/now/tree/master/examples), to help you get going with your project as fast as possible.

<Quickstarts>
  {quickstarts.map(({ name, ...quickstart }) => (
    <Quickstart quickstart={name} {...quickstart} />
  ))}
</Quickstarts>

## Related

For more information on what to do next, we recommend the following articles:

<Card title="Git Integrations" href="/docs/v2/git-integrations">
  Learn more about how ZEIT Now integrates with Git to make your workflow
  easier.
</Card>

<Card title="Using Custom Domains" href="/docs/v2/custom-domains">
  Once deployed, your projects can be assigned to a custom domain or specified
  name of your choice to give it a primary place to see the latest version of
  your application.
</Card>

export default ({ children }) => <Doc meta={meta}>{children}</Doc>

export const config = {
  amp: 'hybrid'
}
